<template>
	<view class="autoTextarea">
		<textarea :auto-height="true" maxlength="200" v-model="autoContent" placeholder="粘贴地址信息，自动拆分姓名、电话和地址"></textarea>
		<view class="menu_box" @tap="IntelReco">
			<view class="menu">识别</view>
		</view>	
	</view>
</template>

<script>
	import matchInfo from '@/components/yk-AutoReco/js/matchAddress.js';
	export default {
		data() {
			return {
				autoContent: '', //粘贴的地址信息
			};
		},
		props: {
			//按钮背景色
			'bgColor': {
				type: String,
				default: 'rgb(227, 121, 221)'
			},
			//字体颜色
			'fontColor': {
				type: String,
				default: '#ffffff'
			}
		},
		methods: {
			IntelReco() {
				//如有识别不准确，比如省市区，请手动修改addressList.js里的省市区信息，可能有些信息滞后了

				//地址格式部分示例如下：

				//张世成15000000000河南郑州金水区XX小区X楼xxx室

				//郑州市管城回族区航海东路与明理路交叉口往南100米紫荆花园，刘一刀，电话13111111111

				// 地址：广东省深圳市福田区福田街道福山社区彩田路2038号
				// 收件人：赵子龙
				// 电话：13111111111

				// 江苏省 苏州市 吴中区 太湖西路325号 张翰 15111111111

				if (this.autoContent) {
					let addressInfo = matchInfo(this.autoContent.trim());
					this.$emit('selectAddress', addressInfo)
					this.autoContent = '';
					uni.showToast({
						title: "地址已填充，如有识别不精确处请手动修补！",
						icon: 'success'
					})
				} else {
					uni.showToast({
						title: "未检测到有效的地址信息",
						icon: 'error'
					})
				}
			}
		}
	};
</script>

<style lang="scss">
	.autoTextarea {
		width: 92%;
		margin: 0 auto 4%;
		background-color: #fff;
		padding: 4%;

		textarea {
			width: 100%;
			min-height: 120rpx;
			font-size: 3.5vw;
			color: #333;
		}
	}
	
	.autoTextarea .menu_box{
		width: 100%;
		display: flex;
		justify-content: flex-end;
	}
	
	.autoTextarea .menu{
		font-size: 3.5vw;
		color: #fff;
		background-color: #FF7602;
		height: 8vw;
		line-height: 8vw;
		padding: 0 3vw;
		border-radius: 8vw;
	}
</style>
